<template>
	<view class="address_information">
		<view class="home_body">
			<view class="userAddress_title">
				<view class="userAdderss_content">
						<u-text text="收获地址"  class="address_title"></u-text>
				</view>
			</view>
			<view class="home_body_details"  v-for="(addressList,index) in addressList" :key="index">
				<view class="home_body_details_rightDiv" >
					<view class="" >
						<u-text size="16" lines="1" :text="addressList.detailedAddress" class="address_detailedAddress"></u-text>
						<u-text size="12" color="#9A9A9A" :text="addressList.consignee" class="address_consignee"></u-text>
						<u-text size="12" color="#9A9A9A" :text="addressList.phone" class="address_phone"></u-text>
					</view>
					<view class="address_icon"  >
						<u-icon name="edit-pen" color="#2979ff" class="address_modify" size="18" @click="toUpdateAddress(addressList)"></u-icon>
						<u-icon name="trash" color="#2979ff" size="18" class="address_delete"  @click="deleteAddressById(addressList.id)"></u-icon>
					</view>
				</view>
			</view>
		</view>	
		<view class="" class="address_button" @click="toAddAddress">
			<u-button type="primary" text="新增地址" ></u-button>
		</view>
	</view>
</template>
	
<script>
	export default {
		data() {
			return {
				// 其他地址信息集合
				addressList:{},
				// 用户id
				userId:'',
				// 第一条数据id
				firstId:'',
				// 第一条数据类型
				addressType:'',
			}
		},
		mounted(){
			// 头部获取用户id
			this.userId = uni.getStorageSync('id')
			//根据用户id查询收货地址
			this.getAllAddressByUserId()
		},
		methods: {
			// 修改地址类型
			updateFirstAdderssType(){
				this.$myRequest({
					url:'/eat-service/userAddress/updateFirstAdderssType',
					method:'get',
					data:{
						'id' : this.firstId
					}
				}).then(res => {
					if(res.data.flag != null){
						//根据用户id查询收货地址
						this.getAllAddressByUserId()
					}
				})
			},
			// 删除地址
			deleteAddressById(id){
				this.$myRequest({
					url:'/eat-service/userAddress/deleteAddressById',
					method:'get',
					data:{
						'id' : id,
					}
				}).then(res => {
					if(res.data.flag != null){
						//根据用户id查询收货地址
						this.getAllAddressByUserId()
						uni.showToast({
							title: '删除成功',
							//将值设置为 success 或者直接不用写icon这个参数
							icon: 'success',
							//显示持续时间为 2秒
							duration: 2000
						})
					} else {
						uni.showToast({
							title: '修改失败',
							//将值设置为 success 或者直接不用写icon这个参数
							icon: 'success',
							//显示持续时间为 2秒
							duration: 2000
						})
					}
				})
			},
			// 去修改页面
			toUpdateAddress(addressList){
				uni.navigateTo({
					url: '/pages/personal/address/update-address?id=' + addressList.id
				})
			},
			//根据用户id查询收货地址
			getAllAddressByUserId() {
				this.$myRequest({
					url: '/eat-service/userAddress/getAllAddressByUserId',
					method: 'get',
					data:{
						userProtalId : this.userId,
					}
				}).then(res => {
					this.addressList = res.data.obj
					this.firstId = this.addressList[0].id
					this.addressType = this.addressList[0].addressType
					if(this.addressType == 1){
						// 修改地址类型
						this.updateFirstAdderssType()
					}
				})
			},
			// 跳转新增地址页面
			toAddAddress(){
				uni.navigateTo({
					url: '/pages/personal/address/add-address'
				})
			}
		}
	}
</script>

<style scoped>
	.address_title{
		line-height: 2.5;
	}
	.address_information{
		 height: 850px;
		 background-color:#F6F6F6 ;
	}
	.home_body_details_rightDiv{
		height: 70px;
		background-color: white;
		margin-top: 20px;
	}
	.address_detailedAddress{
		padding-left: 30px;
		padding-top: 10px;
		width: 76%;
	}
	.address_consignee{
		 float: left;
		 width: 20%;
		 padding-left: 30px;
		 padding-top: 6px;
	}
	.address_phone{
		float: left;
		width: 20%;
		padding-top: 6px;
	}
	.address_icon{
		height: 60px;
		width: 40px;
		margin-left: 370px;
		margin-top: -10px;
	}
	.address_modify{
		float: left;
		margin-left: -10px;
	}
	.address_delete{
		float: left;
		margin-left: 10px;
	}
	.address_button{
		width: 70%;
		margin: 0 auto;
		margin-top: 100px;
	}
	.userAddress_title{
		width: 100%;
		height: 36px;
		padding-top: 10px;
	}
	.userAdderss_content{
		 width: 74%;
		 height: 36px;
		 float: left;
		 padding-left: 10px;
	}
</style>